<template>
  <div class="m-theFollowUp">
    <div class="m-searchPanel m-searchPanelA">
      <div class="layout-2">
        <el-form :model="searchForm" :inline="true">
          <el-row :gutter="30">
            <el-col :span="6">
              <el-form-item label="项目">
                <el-select v-model="searchForm.type" placeholder="请选择" clearable>
                  <el-option label="存款" value="102"></el-option>
                  <el-option label="转入" value="101"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="提案状态">
                <el-select v-model="searchForm.proposalStatus" placeholder="请选择" clearable>
                  <el-option label="待确认" value="0"></el-option>
                  <el-option label="待审批" value="1"></el-option>
                  <el-option label="已审批" value="2"></el-option>
                  <el-option label="已取消" value="-1"></el-option>
                  <el-option label="逾期" value="-2"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="交易平台" prop="platform">
                <el-select v-model="searchForm.platform" placeholder="请选择" clearable>
                  <el-option label="GTS2" value="GTS2"></el-option>
                  <el-option label="MT4" value="MT4"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6" class="searchBtns">
              <el-button type="primary" icon="el-icon-search" @click="search" :loading="dataListLoading">查询</el-button>
              <el-button type="primary" plain icon="el-icon-refresh" @click="reset">重置</el-button>
            </el-col>
          </el-row>
          <el-row :gutter="30">
            <el-col :span="6">
              <el-form-item label="" class="input-with-select">
                <el-input placeholder=" " v-model.trim="searchForm.inputFH" clearable>
                  <el-select v-model="searchForm.typeinputFH" slot="prepend" placeholder="请选择" class="selectInputType">
                    <el-option label="提案号" value="pno"></el-option>
                    <el-option label="交易号" value="dealPid"></el-option>
                  </el-select>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="" class="select-timepick">
                <el-select  placeholder="请选择" v-model="searchForm.timeType" style="width: 130px">
                  <el-option label="提案时间" value="proposalTime"></el-option>
                  <el-option label="最后更新时间" value="updateTime"></el-option>
                </el-select>
                <el-date-picker
                  v-model="searchForm.timeSelect"
                  type="datetimerange"
                  :editable="false"
                  :unlink-panels="true"
                  :picker-options="pickerOptions"
                  format="yyyy-MM-dd HH:mm:ss"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
    </div>
    <div class="m-dataList">
      <el-table
        :data="dataList"
        style="width: 100%"
        :max-height="600"
        v-loading="dataListLoading"
        element-loading-text="loading..."
        ref="dataList"
      >
        <el-table-column
          prop="cus_tran_type"
          width="100"
          label="项目">
          <template slot-scope="scope">
            {{scope.row.cus_tran_type | type}}
          </template>
        </el-table-column>
        <el-table-column
          prop="pno"
          label="提案号"
          min-width="150">
        </el-table-column>
        <el-table-column
          prop="deal_p_id_int"
          label="交易号"
          width="120">
        </el-table-column>
        <el-table-column
          prop="account_no"
          label="交易账号"
          width="120">
        </el-table-column>
        <el-table-column
          prop="platform"
          label="交易平台"
          width="80">
        </el-table-column>
        <el-table-column
          prop="pay_currency"
          label="存款货币"
          width="80">
        </el-table-column>
        <el-table-column
          prop="pay_amount"
          label="存款金额"
          align="right"
          :formatter="countDateMoneyFormat"
          width="120">
        </el-table-column>
        <el-table-column
          prop="deposit_fee"
          label="手续费"
          align="right"
          :formatter="countDateMoneyFormat"
          width="120">
        </el-table-column>
        <el-table-column
          prop="exchange_rate"
          label="存款汇率"
          width="120">
        </el-table-column>
        <el-table-column
          prop="gateway_currency"
          label="支付平台结算货币"
          width="150">
        </el-table-column>
        <el-table-column
          prop="gatewayAmount"
          label="发给支付平台金额"
          align="right"
          :formatter="countDateMoneyFormat"
          width="150">
        </el-table-column>
        <el-table-column
          prop="account_currency"
          label="账号货币"
          width="120">
        </el-table-column>
        <el-table-column
          prop="trans_amount_fee"
          label="最终存款金额"
          align="right"
          :formatter="countDateMoneyFormat"
          width="120">
        </el-table-column>
        <el-table-column
          prop="bank_pay_method"
          label="存款途径"
          width="80">
          <template slot-scope="scope">
            {{scope.row.bank_pay_method | bankPayMethod}}
          </template>
        </el-table-column>
        <el-table-column
          prop="gateway_code"
          label="支付平台"
          width="160">
          <template slot-scope="scope">
            {{scope.row.gateway_code | gatewayCode}}
          </template>
        </el-table-column>
        <el-table-column
          prop="cashin_channel"
          label="终端类型"
          width="80">
          <template slot-scope="scope">
            {{scope.row.cashin_channel | cashinChannel}}
          </template>
        </el-table-column>
        <el-table-column
          prop="flag_withdraw"
          label="可取款/可转账"
          width="120">
          <template slot-scope="scope">
            {{scope.row.flag_withdraw | flagWithdraw}}
          </template>
        </el-table-column>
        <el-table-column
          prop="proposal_status"
          label="提案状态"
          width="80">
           <template slot-scope="scope">
          {{scope.row.proposal_status | proposalStatus}}
        </template>
        </el-table-column>
        <el-table-column
          prop="proposer"
          label="提案人"
          width="120">
        </el-table-column>
        <el-table-column
          prop="proposal_date"
          label="提案时间"
          :formatter="countTimeFormat"
          width="160">
        </el-table-column>
        <el-table-column
          prop="org_create_ip"
          label="提案IP"
          width="140">
        </el-table-column>
        <el-table-column
          prop="pre_approver"
          label="确认人"
          width="120">
        </el-table-column>
        <el-table-column
          prop="approver"
          label="审批人"
          width="120">
        </el-table-column>
        <el-table-column
          prop="update_date"
          label="最后更新时间"
          :formatter="countTimeFormat"
          width="160">
        </el-table-column>
        <el-table-column
          prop="pending_expire_date"
          label="提案过期时间"
          :formatter="countTimeFormat"
          width="160">
        </el-table-column>
        <el-table-column
          prop="remark"
          label="备注"
          width="120">
        </el-table-column>
        <el-table-column
          prop="deposit_status"
          label="入金状态"
          width="80">
        </el-table-column>
      </el-table>
    </div>
    <div class="m-pagination">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes=pagination.pageSizeList
        :current-page=pagination.pageNo
        :page-size=pagination.pageSize
        layout="total, sizes, prev, pager, next"
        :total=pagination.total>
      </el-pagination>
    </div>
  </div>
</template>

<script>
  import * as Utils from '@/utils'
  import * as RealaccountAPI from '@/Api/realaccount'
  export default {
    name: 'TheAccountDetailsDeposit',
    data () {
      return {
        searchForm: {
          type:'',
          proposalStatus:'',
          platform:'',
          timeType: 'proposalTime',
          timeSelect: Utils.thisWeek(),
          inputFH:'',
          typeinputFH:'pno',
        },
        pagination: Utils.commonPagination(),
        pickerOptions: Utils.pickerOptions(),
        dataList: [],
        dataListLoading:false,
        ajaxSearchParams:{},
      }
    },
    props:['type'],
    computed: {
      queryId(){
        return this.$route.params.id.split('_')[1]
      }
    },
    watch:{
      'searchForm.inputFH'(val){
        if(val) {
          this.searchForm.timeSelect = null;
        } else {
          this.searchForm.timeSelect = Utils.thisWeek();
        }
      }
    },
    filters:{
      type(val){
        if(val == '100') {
          return '存款'
        } else if(val =='101') {
          return '转入'
        } else if(val =='102') {
          return '存款'
        } else {
          return '存款';
        }
      },
      bankPayMethod(val){
        let _list = {
          C:'支票',
          CR:'信用卡',
          D:'现金',
          EW:'电子钱包',
          O:'其它',
          P:'网银',
          RE:'汇款',
          T:'电汇'
        };
        if(_list.hasOwnProperty(val)) {
          return _list[val];
        } else  {
          return val
        }
      },
      gatewayCode(val){
        let _list = {
         dashi:'支付大师',
          huayin:'华银',
          xmtapay:'3xmtapay',
          chinaway_cashier:'华道H5收银台',
          rpn_web:'RPN Web',
          rpn_mobile:'RPN Mobile',
          yeepay:'亿付',
          wintei:'真易支付',
          allscore:'商银信支付',
          Amopay:'AMOPAY支付',
          baofoo_new:'AsiaSwift支付',
          chinagpay:'CHINAGPAY 支付',
          chinagpay_signpay:'Chinagpay快付',
          chinaway:'华道支付',
          chinaway_scanpay:'华道扫码支付',
          chinaway_swift:'华道快捷支付',
          chinaway_web:'华道网银支付',
          chinaway_withdraw:'华道代付',
          dinpay:'智付支付',
          dinpay_wechat:'微信支付',
          epaylink:'epaylinks',
          globalcollect:'GLOBALCOLLECT支付',
          gopay:'国付宝',
          ielpm:'易势支付',
          ielpm_scanpay:'易势扫码支付',
          ielpm_web:'易势网银支付',
          lakala:'LAKALA支付',
          mpay_egpay:'MPAY支付',
          payeco:'Payeco 支付',
          payeco_mobile:'Payeco 移动支付',
          richfull:'RICHFULL支付',
          unipay:'unipay',
          dotcom:'dotcom',
          sbcoin:'sbcoin'
        };
        if(_list.hasOwnProperty(val)) {
          return _list[val];
        } else  {
          return val
        }
      },
      proposalStatus(val){
        if(val == '-3') {
          return '系统拒绝'
        }
        else if(val =='-2') {
          return '逾期'
        }
        else if(val =='-1') {
          return '已取消'
        }
        else if(val =='0') {
          return '待确认'
        }
        else if(val =='1') {
          return '待审批'
        }
        else if(val =='2') {
          return '已审批'
        }
        else {
          return val;
        }
      },
      cashinChannel(val) {
        if(val == 'MOBILE') {
          return '移动端'
        }
        else if(val =='PC') {
          return 'PC端'
        }
        else {
          return val;
        }
      },
      flagWithdraw(val) {
        if(val === true) {
          return '是'
        }
        else if(val === false) {
          return '否'
        }
        else {
          return val;
        }
      },
    },
    methods: {
      reset(){
        this.searchForm = Object.assign({},this.copySearchForm);
      },
      handleSizeChange(size) {
        this.pagination.pageSize = size;
        if (this.pagination.pageNo == 1) {
          this.queryList();
        } else {
          this.pagination.pageNo = 1;
        }
      },
      handleCurrentChange(index) {
        this.pagination.pageNo = index;
        this.queryList();

      },
      search(){
        this.ajaxSearchParams = Utils.searchParamsFormat(this.searchForm);
        if (this.pagination.pageNo == 1) {
          this.queryList();
        } else {
          this.pagination.pageNo = 1;
        }
      },
      queryList(){
        this.dataListLoading = true;
        if (this.$refs.dataList) {
          this.$refs.dataList.bodyWrapper.scrollTop = 0;
        }
        RealaccountAPI.realaccountInfo2_3(Object.assign({
          queryId: this.queryId,
          pageSize: this.pagination.pageSize,
          pageNo: this.pagination.pageNo-1
        },this.ajaxSearchParams))
          .then(res => {
            this.dataListLoading = false;
            if (res.code != '0') {
              this.$notify.warning({
                title: '温馨提示',
                message: res.msg
              })
              return
            }
            this.dataList = res.data.content;
            this.pagination.total = res.data.totalElements;
          })
          .catch(error => {
            this.dataListLoading = false;
            console.log(error)
          })
      },
      countTimeFormat(row, column){
        return Utils.countDateTimeFormat(row[column.property])
      },
      countDateMoneyFormat(row, column){
        return Utils.countDateMoneyFormat(row[column.property])
      },
    },
    created(){
      this.copySearchForm = Object.assign({},this.searchForm);
      this.search()
    }
  }
</script>

<style scoped lang="scss">

</style>
